<!DOCTYPE html>
<!-- saved from url=(0052)http://getbootstrap.com/docs/4.0/examples/dashboard/ -->
<html lang="en" xmlns:th="http://www.thymeleaf.org">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
		<meta name="description" content="">
		<meta name="author" content="">

		<title>互联网就业市场数据分析</title>
		<!-- Bootstrap core CSS -->
		<link th:href="@{/css/bootstrap.min.css}" rel="stylesheet">

		<!-- Custom styles for this template -->
		<link th:href="@{/css/dashboard.css}" rel="stylesheet">
		<link rel="icon" th:href="@{/img/bootstrap.svg}" type="image/x-icon"/>
		<link rel="bookmark" th:href="@{/img/bootstrap.svg}" type="image/x-icon"/>

		<style type="text/css">
			/* Chart.js */
			
			@-webkit-keyframes chartjs-render-animation {
				from {
					opacity: 0.99
				}
				to {
					opacity: 1
				}
			}
			
			@keyframes chartjs-render-animation {
				from {
					opacity: 0.99
				}
				to {
					opacity: 1
				}
			}
			
			.chartjs-render-monitor {
				-webkit-animation: chartjs-render-animation 0.001s;
				animation: chartjs-render-animation 0.001s;
			}
		</style>
	</head>

	<body>

		<nav class="navbar navbar-dark sticky-top bg-dark flex-md-nowrap p-0 fixed-top">
			<a class="navbar-brand col-sm-3 col-md-2 mr-0" href="https://www.zhipin.com/?ka=header-home">Data Work</a>
			<!--查询功能-->
			<form class="form-inline" th:action="@{/list}" method="post">

				<input class="form-control form-control-dark" name="jobName" type="text" placeholder="职位名称/公司名称/职位标签" >

				<button type="submit" value="查询" class="btn btn-dark">Search</button>

			</form>
<!--			<form class="form-inline">-->
<!--				<input class="form-control" type="text" placeholder="Search">-->
<!--				<button class="btn btn-success" type="submit">Search</button>-->
<!--			</form>-->
		</nav>

		<div class="container-fluid">
			<div class="row">
				<nav class="col-md-2 d-none d-md-block bg-light sidebar">
					<div class="sidebar-sticky">
						<ul class="nav flex-column">
							<li class="nav-item">
								<a class="nav-link active" th:href="@{/index}">
									<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-home">
										<path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"></path>
										<polyline points="9 22 9 12 15 12 15 22"></polyline>
									</svg>
									欢迎使用！
								</a>
							</li>
							<li class="nav-item">
								<a class="nav-link" th:href="@{/InformationSecurity}">
									<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-bar-chart-2">
										<line x1="18" y1="20" x2="18" y2="10"></line>
										<line x1="12" y1="20" x2="12" y2="4"></line>
										<line x1="6" y1="20" x2="6" y2="14"></line>
									</svg>
									信息安全
								</a>
							</li>
							<li class="nav-item">
								<a class="nav-link" th:href="@{/Operation}">
									<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-calendar"><rect x="3" y="4" width="18" height="18" rx="2" ry="2"></rect><line x1="16" y1="2" x2="16" y2="6"></line><line x1="8" y1="2" x2="8" y2="6"></line><line x1="3" y1="10" x2="21" y2="10"></line></svg>
									<polygon points="12 2 2 7 12 12 22 7 12 2"></polygon>
									<polyline points="2 17 12 22 22 17"></polyline>
									<polyline points="2 12 12 17 22 12"></polyline>
									</svg>
									运营维护
								</a>
							</li>
							<li class="nav-item">
								<a class="nav-link" th:href="@{/Artificial}">
									<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-file">
										<path d="M13 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V9z"></path>
										<polyline points="13 2 13 9 20 9"></polyline>
									</svg>
									人工智能
								</a>
							</li>
							<li class="nav-item">
								<a class="nav-link" th:href="@{/SoftwareTesting}">
									<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-shopping-cart">
										<circle cx="9" cy="21" r="1"></circle>
										<circle cx="20" cy="21" r="1"></circle>
										<path d="M1 1h4l2.68 13.39a2 2 0 0 0 2 1.61h9.72a2 2 0 0 0 2-1.61L23 6H6"></path>
									</svg>
									软件测试
								</a>
							</li>
							<li class="nav-item">
								<a class="nav-link" th:href="@{/BigData}">
									<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-home">
										<polygon points="12 2 2 7 12 12 22 7 12 2"></polygon>
										<polyline points="2 17 12 22 22 17"></polyline>
										<polyline points="2 12 12 17 22 12"></polyline>
									</svg>
									大数据
								</a>
							</li>
							<li class="nav-item">
								<a class="nav-link" th:href="@{/Network}">
									<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-users">
										<path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"></path>
										<circle cx="9" cy="7" r="4"></circle>
										<path d="M23 21v-2a4 4 0 0 0-3-3.87"></path>
										<path d="M16 3.13a4 4 0 0 1 0 7.75"></path>
									</svg>
									网络通信
								</a>
							</li>

							<li class="nav-item">
								<a class="nav-link" th:href="@{/SoftwareEngineering}">
									<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-file-text">
										<path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"></path>
										<polyline points="14 2 14 8 20 8"></polyline>
										<line x1="16" y1="13" x2="8" y2="13"></line>
										<line x1="16" y1="17" x2="8" y2="17"></line>
										<polyline points="10 9 9 9 8 9"></polyline>
									</svg>
									软件工程
								</a>
							</li>
						</ul>
						<!--无用的展示栏-->
						<h6 class="sidebar-heading d-flex justify-content-between align-items-center px-3 mt-4 mb-1 text-muted">
              <span>Saved reports</span>
              <a class="d-flex align-items-center text-muted" href="http://getbootstrap.com/docs/4.0/examples/dashboard/dashboard.html#index.html">
                <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-plus-circle"><circle cx="12" cy="12" r="10"></circle><line x1="12" y1="8" x2="12" y2="16"></line><line x1="8" y1="12" x2="16" y2="12"></line></svg>
              </a>
            </h6>
						<ul class="nav flex-column mb-2">
							<li class="nav-item">
								<a class="nav-link" href="http://getbootstrap.com/docs/4.0/examples/dashboard/dashboard.html#index.html">
									<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-camera" viewBox="0 0 16 16">
										<path d="M15 12a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V6a1 1 0 0 1 1-1h1.172a3 3 0 0 0 2.12-.879l.83-.828A1 1 0 0 1 6.827 3h2.344a1 1 0 0 1 .707.293l.828.828A3 3 0 0 0 12.828 5H14a1 1 0 0 1 1 1v6zM2 4a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2h-1.172a2 2 0 0 1-1.414-.586l-.828-.828A2 2 0 0 0 9.172 2H6.828a2 2 0 0 0-1.414.586l-.828.828A2 2 0 0 1 3.172 4H2z"/>
										<path d="M8 11a2.5 2.5 0 1 1 0-5 2.5 2.5 0 0 1 0 5zm0 1a3.5 3.5 0 1 0 0-7 3.5 3.5 0 0 0 0 7zM3 6.5a.5.5 0 1 1-1 0 .5.5 0 0 1 1 0z"/>
									</svg>
									Current month
								</a>
							</li>
							<li class="nav-item">
								<a class="nav-link" href="http://getbootstrap.com/docs/4.0/examples/dashboard/dashboard.html#index.html">

									<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-chat-right-text-fill" viewBox="0 0 16 16">
										<path d="M16 2a2 2 0 0 0-2-2H2a2 2 0 0 0-2 2v8a2 2 0 0 0 2 2h9.586a1 1 0 0 1 .707.293l2.853 2.853a.5.5 0 0 0 .854-.353V2zM3.5 3h9a.5.5 0 0 1 0 1h-9a.5.5 0 0 1 0-1zm0 2.5h9a.5.5 0 0 1 0 1h-9a.5.5 0 0 1 0-1zm0 2.5h5a.5.5 0 0 1 0 1h-5a.5.5 0 0 1 0-1z"/>
									</svg>
									Last quarter
								</a>
							</li>
							<li class="nav-item">
								<a class="nav-link" href="http://getbootstrap.com/docs/4.0/examples/dashboard/dashboard.html#index.html">
									<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-camera-reels" viewBox="0 0 16 16">
										<path d="M6 3a3 3 0 1 1-6 0 3 3 0 0 1 6 0zM1 3a2 2 0 1 0 4 0 2 2 0 0 0-4 0z"/>
										<path d="M9 6h.5a2 2 0 0 1 1.983 1.738l3.11-1.382A1 1 0 0 1 16 7.269v7.462a1 1 0 0 1-1.406.913l-3.111-1.382A2 2 0 0 1 9.5 16H2a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h7zm6 8.73V7.27l-3.5 1.555v4.35l3.5 1.556zM1 8v6a1 1 0 0 0 1 1h7.5a1 1 0 0 0 1-1V8a1 1 0 0 0-1-1H2a1 1 0 0 0-1 1z"/>
										<path d="M9 6a3 3 0 1 0 0-6 3 3 0 0 0 0 6zM7 3a2 2 0 1 1 4 0 2 2 0 0 1-4 0z"/>
									</svg>
									Social engagement
								</a>
							</li>
							<li class="nav-item">
								<a class="nav-link" href="http://getbootstrap.com/docs/4.0/examples/dashboard/dashboard.html#index.html">

									<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-badge-tm-fill" viewBox="0 0 16 16">
										<path d="M2 2a2 2 0 0 0-2 2v8a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V4a2 2 0 0 0-2-2H2zm3.295 3.995V11H4.104V5.995h-1.7V5H7v.994H5.295zM8.692 7.01V11H7.633V5.001h1.209l1.71 3.894h.039l1.71-3.894H13.5V11h-1.072V7.01h-.057l-1.42 3.239h-.773L8.75 7.008h-.058z"/>
									</svg>
									Year-end sale
								</a>
							</li>
						</ul>
					</div>
				</nav>

				<main role="main" class="col-md-9 ml-sm-auto col-lg-10 pt-3 px-4">
					<div class="chartjs-size-monitor" style="position: absolute; left: 0px; top: 0px; right: 0px; bottom: 0px; overflow: hidden; pointer-events: none; visibility: hidden; z-index: -1;">
						<div class="chartjs-size-monitor-expand" style="position:absolute;left:0;top:0;right:0;bottom:0;overflow:hidden;pointer-events:none;visibility:hidden;z-index:-1;">
							<div style="position:absolute;width:1000000px;height:1000000px;left:0;top:0"></div>
						</div>
						<div class="chartjs-size-monitor-shrink" style="position:absolute;left:0;top:0;right:0;bottom:0;overflow:hidden;pointer-events:none;visibility:hidden;z-index:-1;">
							<div style="position:absolute;width:200%;height:200%;left:0; top:0"></div>
						</div>
					</div>
					<!--顶部栏-->
					<div class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pb-2 mb-3 border-bottom">
						<h1 id="a" class="h2">Boss直聘-互联网职业分析</h1>
						<div class="btn-toolbar mb-2 mb-md-0">
							<div class="btn-group mr-2">
								<button class="btn btn-sm btn-outline-secondary">Share</button>
								<button class="btn btn-sm btn-outline-secondary">Export</button>
							</div>
<!--							<button class="btn btn-sm btn-outline-secondary dropdown-toggle">-->
<!--								<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-calendar"><rect x="3" y="4" width="18" height="18" rx="2" ry="2"></rect><line x1="16" y1="2" x2="16" y2="6"></line><line x1="8" y1="2" x2="8" y2="6"></line><line x1="3" y1="10" x2="21" y2="10"></line></svg>-->
<!--								This week-->
<!--							</button>-->
							<button class="btn btn-primary dropdown-toggle" data-toggle="dropdown">
                				<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-calendar"><rect x="3" y="4" width="18" height="18" rx="2" ry="2"></rect><line x1="16" y1="2" x2="16" y2="6"></line><line x1="8" y1="2" x2="8" y2="6"></line><line x1="3" y1="10" x2="21" y2="10"></line></svg>
                					This week
              				</button>
						</div>
					</div>

					<h2>we'll be the same soon</h2>
					<div>
						<button type="button" class="btn btn-outline-info dropdown-toggle float-right" data-toggle="dropdown">
							导航
						</button>
						<div class="dropdown-menu" role="menu">
							<a class="dropdown-item text-left" th:href="@{/redic}">
								<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-arrow-up-circle-fill" viewBox="0 0 16 16">
									<path d="M16 8A8 8 0 1 0 0 8a8 8 0 0 0 16 0zm-7.5 3.5a.5.5 0 0 1-1 0V5.707L5.354 7.854a.5.5 0 1 1-.708-.708l3-3a.5.5 0 0 1 .708 0l3 3a.5.5 0 0 1-.708.708L8.5 5.707V11.5z"/>
								</svg>
								刷  新
							</a>
								<a class="dropdown-item text-left" href="#a">展示图一</a>
								<a class="dropdown-item text-left" href="#b">展示图二</a>
								<a class="dropdown-item text-left" href="#c">展示图三</a>
								<a class="dropdown-item text-left" href="#d">展示图四</a>
								<a class="dropdown-item text-left" href="#e">展示图五</a>
						</div>
					</div>
					<div id="66" class="chart-container" style="width:980px; height:620px;"></div>


					<!--动态词云图-->
					<div>
						<h2 id="b">Desire has no rest</h2>
						<h2>公司职位福利</h2>
						<button type="button" class="btn btn-outline-info dropdown-toggle float-right" data-toggle="dropdown">
							导航
						</button>
						<div class="dropdown-menu" role="menu">
							<a class="dropdown-item text-left" th:href="@{/redic}">
								<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-arrow-up-circle-fill" viewBox="0 0 16 16">
									<path d="M16 8A8 8 0 1 0 0 8a8 8 0 0 0 16 0zm-7.5 3.5a.5.5 0 0 1-1 0V5.707L5.354 7.854a.5.5 0 1 1-.708-.708l3-3a.5.5 0 0 1 .708 0l3 3a.5.5 0 0 1-.708.708L8.5 5.707V11.5z"/>
								</svg>
								刷  新
							</a>
							<a class="dropdown-item text-left" href="#a">展示图一</a>
							<a class="dropdown-item text-left" href="#b">展示图二</a>
							<a class="dropdown-item text-left" href="#c">展示图三</a>
							<a class="dropdown-item text-left" href="#d">展示图四</a>
							<a class="dropdown-item text-left" href="#e">展示图五</a>
						</div>
					</div>
					<div id="77" class="chart-container" style="width:980px; height:620px;"></div>




					<!--饼图-->
					<h2 id="c">viva la vida</h2>
					<div>
						<button type="button" class="btn btn-outline-info dropdown-toggle float-right" data-toggle="dropdown">
							导航
						</button>
						<div class="dropdown-menu" role="menu">
							<a class="dropdown-item text-left" th:href="@{/redic}">
								<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-arrow-up-circle-fill" viewBox="0 0 16 16">
									<path d="M16 8A8 8 0 1 0 0 8a8 8 0 0 0 16 0zm-7.5 3.5a.5.5 0 0 1-1 0V5.707L5.354 7.854a.5.5 0 1 1-.708-.708l3-3a.5.5 0 0 1 .708 0l3 3a.5.5 0 0 1-.708.708L8.5 5.707V11.5z"/>
								</svg>
								刷  新
							</a>
							<a class="dropdown-item text-left" href="#a">展示图一</a>
							<a class="dropdown-item text-left" href="#b">展示图二</a>
							<a class="dropdown-item text-left" href="#c">展示图三</a>
							<a class="dropdown-item text-left" href="#d">展示图四</a>
							<a class="dropdown-item text-left" href="#e">展示图五</a>
						</div>
					</div>
					<div id="7e3f9ee25cbe4be59b6f253316b4ad18" class="chart-container" style="width:980px; height:800px;"></div>




					<!--柱状-->
					<h2 id="d">go big or go home</h2>
					<div>
						<button type="button" class="btn btn-outline-info dropdown-toggle float-right" data-toggle="dropdown">
							导航
						</button>
						<div class="dropdown-menu" role="menu">
							<a class="dropdown-item text-left" th:href="@{/redic}">
								<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-arrow-up-circle-fill" viewBox="0 0 16 16">
									<path d="M16 8A8 8 0 1 0 0 8a8 8 0 0 0 16 0zm-7.5 3.5a.5.5 0 0 1-1 0V5.707L5.354 7.854a.5.5 0 1 1-.708-.708l3-3a.5.5 0 0 1 .708 0l3 3a.5.5 0 0 1-.708.708L8.5 5.707V11.5z"/>
								</svg>
								刷  新
							</a>
							<a class="dropdown-item text-left" href="#a">展示图一</a>
							<a class="dropdown-item text-left" href="#b">展示图二</a>
							<a class="dropdown-item text-left" href="#c">展示图三</a>
							<a class="dropdown-item text-left" href="#d">展示图四</a>
							<a class="dropdown-item text-left" href="#e">展示图五</a>
						</div>
					</div>
					<div id="2218cf072f9d4fff8ba2467e502db8f0" class="chart-container" style="width:980px; height:620px;"></div>



					<!--箱型-->
					<h2 id="e">what's wrong with you</h2>
					<div>
						<button type="button" class="btn btn-outline-info dropdown-toggle float-right" data-toggle="dropdown">
							导航
						</button>
						<div class="dropdown-menu" role="menu">
							<a class="dropdown-item text-left" th:href="@{/redic}">
								<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-arrow-up-circle-fill" viewBox="0 0 16 16">
									<path d="M16 8A8 8 0 1 0 0 8a8 8 0 0 0 16 0zm-7.5 3.5a.5.5 0 0 1-1 0V5.707L5.354 7.854a.5.5 0 1 1-.708-.708l3-3a.5.5 0 0 1 .708 0l3 3a.5.5 0 0 1-.708.708L8.5 5.707V11.5z"/>
								</svg>
								刷  新
							</a>
							<a class="dropdown-item text-left" href="#a">展示图一</a>
							<a class="dropdown-item text-left" href="#b">展示图二</a>
							<a class="dropdown-item text-left" href="#c">展示图三</a>
							<a class="dropdown-item text-left" href="#d">展示图四</a>
							<a class="dropdown-item text-left" href="#e">展示图五</a>
						</div>
					</div>
					<div id="6923582f24d04b7e86ee71ddea2795df" class="chart-container" style="width:980px; height:620px;"></div>

				</main>
			</div>
		</div>

		<!-- Bootstrap core JavaScript
    ================================================== -->
		<!-- Placed at the end of the document so the pages load faster -->
		<!--将pyecharts的图嵌入，先导入js，后将图整体的js导入，将id传入body中的div即可-->
		<script type="text/javascript" th:src="@{/js/jquery-3.2.1.slim.min.js}" ></script>

		<script type="text/javascript" th:src="@{/js/popper.min.js}" ></script>
		<script type="text/javascript" th:src="@{/js/bootstrap.min.js}" ></script>
		<!-- Icons -->
		<script type="text/javascript" th:src="@{/js/feather.min.js}" ></script>
		<!-- Graphs -->
		<script type="text/javascript" th:src="@{/js/Chart.min.js}" ></script>
		<script type="text/javascript" th:src="@{https://assets.pyecharts.org/assets/echarts.min.js}"></script>
		<script type="text/javascript" th:src="@{https://assets.pyecharts.org/assets/echarts-wordcloud.min.js}"></script>
<!--		<script type="text/javascript" th:src="@{/js/jquery-3.2.1.slim.min.js}" ></script>-->
		<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.js"></script>
		<script>
			function getdata(){
				var str=document.getElementById("key");
				alert(str.value);
				window.open('list.html')
			}
		</script>
		<!--饼图-->
		<script>
			var chart_7e3f9ee25cbe4be59b6f253316b4ad18 = echarts.init(
					document.getElementById('7e3f9ee25cbe4be59b6f253316b4ad18'), 'white', {renderer: 'canvas'});
			var option_7e3f9ee25cbe4be59b6f253316b4ad18 = {
				"backgroundColor": "#fff",
				"animation": true,
				"animationThreshold": 2000,
				"animationDuration": 1000,
				"animationEasing": "cubicOut",
				"animationDelay": 0,
				"animationDurationUpdate": 300,
				"animationEasingUpdate": "cubicOut",
				"animationDelayUpdate": 0,
				"color": [
					"#c23531",
					"#2f4554",
					"#61a0a8",
					"#d48265",
					"#749f83",
					"#ca8622",
					"#bda29a",
					"#6e7074",
					"#546570",
					"#c4ccd3",
					"#f05b72",
					"#ef5b9c",
					"#f47920",
					"#905a3d",
					"#fab27b",
					"#2a5caa",
					"#444693",
					"#726930",
					"#b2d235",
					"#6d8346",
					"#ac6767",
					"#1d953f",
					"#6950a1",
					"#918597"
				],
				"series": [
					{
						"type": "pie",
						"name": "\u516c\u53f8\u89c4\u6a21\u5206\u5e03",
						"clockwise": true,
						"data": [
							{
								"name": "0-20",
								"value": 256
							},
							{
								"name": "100-499",
								"value": 656
							},
							{
								"name": "20-99",
								"value": 674
							},
							{
								"name": "500-999",
								"value": 1332
							},
							{
								"name": "10000",
								"value": 2354
							},
							{
								"name": "1000-9999",
								"value": 3782
							}
						],
						itemStyle:{
							normal:{
								label:{
									textStyle:{
										color:'#070719'
									}
								}
							}
						},
						"radius": "55%",
						"center": [
							"50%",
							"50%"
						],
						"roseType": "radius",
						"label": {
							"show": true,
							"position": "top",
							"color": "rgba(255, 255, 255, 0.3)",
							"margin": 8
						},
						"tooltip": {
							"show": true,
							"trigger": "item",
							"triggerOn": "mousemove|click",
							"axisPointer": {
								"type": "line"
							},
							"showContent": true,
							"alwaysShowContent": false,
							"showDelay": 0,
							"hideDelay": 100,
							"formatter": "{a} <br/>{b}: {c} ({d}%)",
							"textStyle": {
								"fontSize": 14
							},
							"borderWidth": 0,
							"padding": 5
						},
						"rippleEffect": {
							"show": true,
							"brushType": "stroke",
							"scale": 2.5,
							"period": 4
						}
					}
				],
				"legend": [
					{
						"data": [
							"0-20",
							"100-499",
							"20-99",
							"500-999",
							"10000",
							"1000-9999"
						],
						"selected": {},
						"show": false,
						"padding": 5,
						"itemGap": 10,
						"itemWidth": 25,
						"itemHeight": 14
					}
				],
				"tooltip": {
					"show": true,
					"trigger": "item",
					"triggerOn": "mousemove|click",
					"axisPointer": {
						"type": "line"
					},
					"showContent": true,
					"alwaysShowContent": false,
					"showDelay": 0,
					"hideDelay": 100,
					"textStyle": {
						"fontSize": 14
					},
					"borderWidth": 0,
					"padding": 5
				},
				"title": [
					{
						"text": "公司规模分布",
						"padding": 5,
						"itemGap": 10,
						"textStyle": {
							"fontSize": 28
						}
					}
				]
			};
			chart_7e3f9ee25cbe4be59b6f253316b4ad18.setOption(option_7e3f9ee25cbe4be59b6f253316b4ad18);
			$(document).ready(function() {
				var values = [];
				$.ajax({
					url : "http://localhost:8080/top10",//后台请求的数据，用的是PHP
					dataType : "json",//数据格式
					type : "GET",//请求方式
					async : false,//是否异步请求
					success : function(datas) {  //如果请求成功，返回数据。
						var names = [];
						var mydata = [];
						console.log(datas);
						var len = eval(datas);
						var data = []
						var servicedata=[];
						if(datas){
							for(var i=0;i<datas.length;i++){
								values.push({
									name:datas[i].companyname,
									value:datas[i].count
								});
							}
						}
						chart_7e3f9ee25cbe4be59b6f253316b4ad18.setOption({
							// xAxis:{
							//     data:names
							// },
							series: [{
								data: values
							}]
						});

					},
					error : function(errorMsg) {
						//请求失败时执行该函数
						alert("图表请求数据失败!");
						myChart.hideLoading();
					}

				})
			})
		</script>
		<!--词云1-->
		<script>
			var ciyun1 = echarts.init(
					document.getElementById('66'), 'white', {renderer: 'canvas'});
			/*var keywords = [{"name":"男神","value":2.64},
				{"name":"好身材","value":4.03},
				{"name":"校草","value":24.95},
				{"name":"酷","value":4.04},
				{"name":"时尚","value":5.27},
				{"name":"阳光活力","value":5.80},
				{"name":"初恋","value":3.09},
				{"name":"英俊潇洒","value":24.71},
				{"name":"霸气","value":6.33},
				{"name":"腼腆","value":2.55},
				{"name":"蠢萌","value":3.88},
				{"name":"青春","value":8.04},
				{"name":"网红","value":5.87},
				{"name":"萌","value":6.97},
				{"name":"认真","value":2.53},
				{"name":"古典","value":2.49},
				{"name":"温柔","value":3.91},
				{"name":"有个性","value":3.25},
				{"name":"可爱","value":9.93},
				{"name":"幽默诙谐","value":3.65}]*/

			var option_ciyun1 = {
				series: [{
					type: 'wordCloud',
					sizeRange: [20, 90],
					rotationRange: [5, 8],
					rotationStep: 45,
					gridSize: 10,
					//shape: 'pentagon',
					width: '100%',
					height: '100%',
					textStyle: {
						normal: {
							color: function () {
								return 'rgb(' + [
									Math.round(Math.random() * 180),
									Math.round(Math.random() * 180),
									Math.round(Math.random() * 180)
								].join(',') + ')';
							}
						},
						emphasis: {  // 单词高亮时显示的效果
							shadowBlur: 10,
							shadowColor: '#198'
						}
					},
					data: []
				}],
				title:[
					{
						text:"职位标签",
						padding:5,
						itemGap:10,
						textStyle:{
							fontSize:28
						}
					}
				]
			};
			ciyun1.setOption(option_ciyun1);
			$(document).ready(function() {
				var values = [];
				$.ajax({
					url : "http://localhost:8080/Tag",//后台请求的数据，用的是PHP
					dataType : "json",//数据格式
					type : "GET",//请求方式
					async : false,//是否异步请求
					success : function(datas) {  //如果请求成功，返回数据。
						var names = [];
						var mydata = [];
						console.log(datas);
						var len = eval(datas);
						var data = []
						var servicedata=[];
						if(datas){
							for(var i=0;i<datas.length;i++){
								values.push({
									name:datas[i].job,
									value:datas[i].count
								});
							}
						}
						ciyun1.setOption({
							// xAxis:{
							//     data:names
							// },
							series: [{
								data: values
							}]
						});

					},
					error : function(errorMsg) {
						//请求失败时执行该函数
						alert("图表请求数据失败!");
						myChart.hideLoading();
					}

				})
			})
		</script>
		<!--柱状图-->
		<script>
			var zhu = echarts.init(
					document.getElementById('2218cf072f9d4fff8ba2467e502db8f0'), 'white', {renderer: 'canvas'});
			var option_zhu = {
				"animation": true,
				"animationThreshold": 2000,
				"animationDuration": 1000,
				"animationEasing": "cubicOut",
				"animationDelay": 0,
				"animationDurationUpdate": 300,
				"animationEasingUpdate": "cubicOut",
				"animationDelayUpdate": 0,
				"color": [
					"#c23531",
					"#2f4554",
					"#61a0a8",
					"#d48265",
					"#749f83",
					"#ca8622",
					"#bda29a",
					"#6e7074",
					"#546570",
					"#c4ccd3",
					"#f05b72",
					"#ef5b9c",
					"#f47920",
					"#905a3d",
					"#fab27b",
					"#2a5caa",
					"#444693",
					"#726930",
					"#b2d235",
					"#6d8346",
					"#ac6767",
					"#1d953f",
					"#6950a1",
					"#918597"
				],
				"series": [
					{
						"type": "bar",
						"name": "\u8d77\u85aa",
						"legendHoverLink": true,
						"data": [],
						"showBackground": false,
						"barMinHeight": 0,
						"barCategoryGap": "20%",
						"barGap": "30%",
						"large": false,
						"largeThreshold": 400,
						"seriesLayoutBy": "column",
						"datasetIndex": 0,
						"clip": true,
						"zlevel": 0,
						"z": 2,
						"label": {
							"show": true,
							"position": "top",
							"margin": 8
						},
						"itemStyle": {
							"color": "#ff6666"
						}
					},
					{
						"type": "bar",
						"name": "\u9876\u85aa",
						"legendHoverLink": true,
						"data": [],
						"showBackground": false,
						"barMinHeight": 0,
						"barCategoryGap": "20%",
						"barGap": "30%",
						"large": false,
						"largeThreshold": 400,
						"seriesLayoutBy": "column",
						"datasetIndex": 0,
						"clip": true,
						"zlevel": 0,
						"z": 2,
						"label": {
							"show": true,
							"position": "top",
							"margin": 8
						},
						"itemStyle": {
							"color": "#00ffcc"
						}
					}
				],
				"legend": [
					{
						"data": [
							"\u8d77\u85aa",
							"\u9876\u85aa"
						],
						"selected": {
							"\u8d77\u85aa": true,
							"\u9876\u85aa": true
						},
						"show": true,
						"padding": 5,
						"itemGap": 10,
						"itemWidth": 25,
						"itemHeight": 14
					}
				],
				"tooltip": {
					"show": true,
					"trigger": "item",
					"triggerOn": "mousemove|click",
					"axisPointer": {
						"type": "line"
					},
					"showContent": true,
					"alwaysShowContent": false,
					"showDelay": 0,
					"hideDelay": 100,
					"textStyle": {
						"fontSize": 14
					},
					"borderWidth": 0,
					"padding": 5
				},
				"xAxis": [
					{
						"show": true,
						"scale": false,
						"nameLocation": "end",
						"nameGap": 15,
						"gridIndex": 0,
						"inverse": false,
						"offset": 0,
						"splitNumber": 5,
						"minInterval": 0,
						"splitLine": {
							"show": false,
							"lineStyle": {
								"show": true,
								"width": 1,
								"opacity": 1,
								"curveness": 0,
								"type": "solid"
							}
						},
						"data": []
					}
				],
				"yAxis": [
					{
						"show": true,
						"scale": false,
						"nameLocation": "end",
						"nameGap": 15,
						"gridIndex": 0,
						"inverse": false,
						"offset": 0,
						"splitNumber": 5,
						"minInterval": 0,
						"splitLine": {
							"show": false,
							"lineStyle": {
								"show": true,
								"width": 1,
								"opacity": 1,
								"curveness": 0,
								"type": "solid"
							}
						}
					}
				],
				"title": [
					{
						"text": "\u5b66\u5386-\u5de5\u8d44",
						"padding": 5,
						"itemGap": 10,
						"textStyle":{
							"fontSize": 28
						}
					}
				]
			};
			zhu.setOption(option_zhu);
			$(document).ready(function() {
				$.ajax({
					url : "http://localhost:8080/Record",//后台请求的数据，用的是PHP
					dataType : "json",//数据格式
					type : "GET",//请求方式
					async : false,//是否异步请求
					success : function(data1) {  //如果请求成功，返回数据。
						var html = "";
						var obj = eval(data1);
						var names = []
						var xls =[]
						var xlss = []
						for(var i=0;i<obj.length;i++){

							names.push(data1[i].record);    //挨个取出类别并填入类别数组
							xls.push(data1[i].ling);
							xlss.push(data1[i].yi);
						}
						$("#test").html(html); //在html页面id=test的标签里显示html内容

						zhu.setOption({
							xAxis:{
								data:names
							},
							series: [{
								data: xls,
							},
								{
									data: xlss
								}]
						});

					},
					error : function(errorMsg) {
						//请求失败时执行该函数
						alert("图表请求数据失败!");
						myChart.hideLoading();
					}
				})
			})
		</script>
		<!--热力-->
		<script>
			var chart_6923582f24d04b7e86ee71ddea2795df = echarts.init(
					document.getElementById('6923582f24d04b7e86ee71ddea2795df'), 'white', {renderer: 'canvas'});
			var option_6923582f24d04b7e86ee71ddea2795df = {
				"animation": true,
				"animationThreshold": 2000,
				"animationDuration": 1000,
				"animationEasing": "cubicOut",
				"animationDelay": 0,
				"animationDurationUpdate": 300,
				"animationEasingUpdate": "cubicOut",
				"animationDelayUpdate": 0,
				"color": [
					"#c23531",
					"#2f4554",
					"#61a0a8",
					"#d48265",
					"#749f83",
					"#ca8622",
					"#bda29a",
					"#6e7074",
					"#546570",
					"#c4ccd3",
					"#f05b72",
					"#ef5b9c",
					"#f47920",
					"#905a3d",
					"#fab27b",
					"#2a5caa",
					"#444693",
					"#726930",
					"#b2d235",
					"#6d8346",
					"#ac6767",
					"#1d953f",
					"#6950a1",
					"#918597"
				],
				"series": [
					{
						"type": "heatmap",
						"name": "\u6700\u4f4e\u85aa\u8d44\u7684\u5e73\u5747\u6570",
						"data": [
							[
								0,
								0,
								20770
							],
							[
								0,
								1,
								12245
							],
							[
								0,
								2,
								15846
							],
							[
								0,
								3,
								29166
							],
							[
								1,
								0,
								18708
							],
							[
								1,
								1,
								12370
							],
							[
								1,
								2,
								15000
							],
							[
								1,
								3,
								25000
							],
							[
								1,
								6,
								25000
							],
							[
								2,
								0,
								17193
							],
							[
								2,
								1,
								11725
							],
							[
								2,
								2,
								11500
							],
							[
								2,
								3,
								21233
							],
							[
								2,
								5,
								7000
							],
							[
								2,
								6,
								19000
							],
							[
								3,
								0,
								18656
							],
							[
								3,
								1,
								11522
							],
							[
								3,
								2,
								13285
							],
							[
								3,
								3,
								27636
							],
							[
								4,
								0,
								7361
							],
							[
								4,
								1,
								5354
							],
							[
								4,
								2,
								5615
							],
							[
								4,
								3,
								8000
							],
							[
								4,
								4,
								5166
							],
							[
								4,
								5,
								10533
							],
							[
								4,
								7,
								5000
							],
							[
								5,
								0,
								14601
							],
							[
								5,
								1,
								10358
							],
							[
								5,
								2,
								16833
							],
							[
								5,
								3,
								22600
							],
							[
								5,
								4,
								5000
							],
							[
								5,
								5,
								15000
							],
							[
								6,
								0,
								13585
							],
							[
								6,
								1,
								9875
							],
							[
								6,
								2,
								11666
							],
							[
								6,
								3,
								15750
							],
							[
								6,
								6,
								25000
							],
							[
								7,
								0,
								13127
							],
							[
								7,
								1,
								7354
							],
							[
								7,
								2,
								10666
							],
							[
								7,
								3,
								22666
							],
							[
								7,
								5,
								8500
							],
							[
								7,
								6,
								25000
							],
							[
								8,
								0,
								12191
							],
							[
								8,
								1,
								7161
							],
							[
								8,
								2,
								2500
							],
							[
								8,
								3,
								14333
							],
							[
								8,
								4,
								3000
							],
							[
								8,
								5,
								4000
							],
							[
								8,
								6,
								19000
							],
							[
								9,
								0,
								12873
							],
							[
								9,
								1,
								7733
							],
							[
								9,
								2,
								2000
							],
							[
								9,
								3,
								13750
							],
							[
								9,
								5,
								5000
							],
							[
								9,
								6,
								20000
							],
							[
								10,
								0,
								10321
							],
							[
								10,
								1,
								7513
							],
							[
								10,
								2,
								15000
							],
							[
								10,
								4,
								6000
							],
							[
								11,
								0,
								12959
							],
							[
								11,
								1,
								9029
							],
							[
								11,
								2,
								4500
							],
							[
								11,
								3,
								15000
							],
							[
								12,
								0,
								9879
							],
							[
								12,
								1,
								6487
							],
							[
								12,
								2,
								8800
							],
							[
								12,
								3,
								8000
							],
							[
								12,
								4,
								4000
							],
							[
								12,
								5,
								4000
							],
							[
								13,
								0,
								9938
							],
							[
								13,
								1,
								7133
							],
							[
								13,
								2,
								7500
							],
							[
								13,
								3,
								12000
							],
							[
								13,
								4,
								3000
							],
							[
								13,
								5,
								4000
							],
							[
								14,
								0,
								11119
							],
							[
								14,
								1,
								7947
							],
							[
								14,
								5,
								4000
							],
							[
								15,
								0,
								11166
							],
							[
								15,
								1,
								6653
							],
							[
								15,
								2,
								3500
							],
							[
								15,
								3,
								18000
							],
							[
								16,
								0,
								10967
							],
							[
								16,
								1,
								6368
							],
							[
								16,
								2,
								4000
							],
							[
								16,
								3,
								13000
							],
							[
								17,
								0,
								10375
							],
							[
								17,
								1,
								5833
							],
							[
								17,
								2,
								5666
							],
							[
								17,
								3,
								12500
							],
							[
								18,
								0,
								10609
							],
							[
								18,
								1,
								5692
							],
							[
								19,
								0,
								15268
							],
							[
								19,
								1,
								7090
							],
							[
								19,
								5,
								4500
							]
						],
						"label": {
							"show": false,
							"position": "inside",
							"margin": 8
						}
					}
				],
				"legend": [
					{
						"data": [
							"\u6700\u4f4e\u85aa\u8d44\u7684\u5e73\u5747\u6570"
						],
						"selected": {
							"\u6700\u4f4e\u85aa\u8d44\u7684\u5e73\u5747\u6570": true
						},
						"show": true,
						"padding": 5,
						"itemGap": 10,
						"right": 65,
						"itemWidth": 30,
						"itemHeight": 17
					}
				],
				"tooltip": {
					"show": true,
					"trigger": "item",
					"position": "right",
					"triggerOn": "mousemove|click",
					"axisPointer": {
						"type": "line"
					},
					"showContent": true,
					"alwaysShowContent": false,
					"showDelay": 0,
					"hideDelay": 100,
					"textStyle": {
						"fontSize": 14
					},
					"borderWidth": 0,
					"padding": 5
				},
				"xAxis": [
					{
						"show": true,
						"scale": false,
						"nameLocation": "end",
						"nameGap": 15,
						"gridIndex": 0,
						"inverse": false,
						"offset": 0,
						"splitNumber": 5,
						"minInterval": 0,
						"splitLine": {
							"show": false,
							"lineStyle": {
								"show": true,
								"width": 1,
								"opacity": 1,
								"curveness": 0,
								"type": "solid"
							}
						},
						"data": [
							"\u5317\u4eac",
							"\u4e0a\u6d77",
							"\u676d\u5dde",
							"\u6df1\u5733",
							"\u8d35\u9633",
							"\u5e7f\u5dde",
							"\u5357\u4eac",
							"\u6210\u90fd",
							"\u897f\u5b89",
							"\u6b66\u6c49",
							"\u957f\u6c99",
							"\u82cf\u5dde",
							"\u90d1\u5dde",
							"\u6d4e\u5357",
							"\u53a6\u95e8",
							"\u5408\u80a5",
							"\u798f\u5dde",
							"\u5929\u6d25",
							"\u9752\u5c9b",
							"\u4e1c\u839e"
						]
					}
				],
				"yAxis": [
					{
						"show": true,
						"scale": false,
						"nameLocation": "end",
						"nameGap": 15,
						"gridIndex": 0,
						"inverse": false,
						"offset": 0,
						"splitNumber": 5,
						"minInterval": 0,
						"splitLine": {
							"show": false,
							"lineStyle": {
								"show": true,
								"width": 1,
								"opacity": 1,
								"curveness": 0,
								"type": "solid"
							}
						},
						"data": [
							"\u672c\u79d1",
							"\u5927\u4e13",
							"\u5b66\u5386\u4e0d\u9650",
							"\u7855\u58eb",
							"\u4e2d\u4e13/\u4e2d\u6280",
							"\u9ad8\u4e2d",
							"\u535a\u58eb",
							"\u521d\u4e2d\u53ca\u4ee5\u4e0b"
						]
					}
				],
				"title": [
					{
						"text": "\u5b66\u5386\u4e0e\u57ce\u5e02\u5171\u540c\u51b3\u5b9a\u7684\u6700\u4f4e\u85aa\u8d44",
						"padding": 5,
						"itemGap": 10,
						"textStyle":{
							"fontSize": 28
						}
					}
				],
				"visualMap": {
					"show": true,
					"type": "continuous",
					"min": 0,
					"max": 30000,
					"inRange": {
						"color": [
							"#50a3ba",
							"#eac763",
							"#d94e5d"
						]
					},
					"calculable": true,
					"inverse": false,
					"splitNumber": 5,
					"orient": "horizontal",
					"left": "center",
					"showLabel": true,
					"itemWidth": 20,
					"itemHeight": 140,
					"borderWidth": 0
				}
			};
			chart_6923582f24d04b7e86ee71ddea2795df.setOption(option_6923582f24d04b7e86ee71ddea2795df);
			$(document).ready(function() {
				var values = [];
				$.ajax({
					url : "http://localhost:8080/Tag",//后台请求的数据，用的是PHP
					dataType : "json",//数据格式
					type : "GET",//请求方式
					async : false,//是否异步请求
					success : function(datas) {  //如果请求成功，返回数据。
						var names = [];
						var mydata = [];
						console.log(datas);
						var len = eval(datas);
						var data = []
						var servicedata=[];
						if(datas){
							for(var i=0;i<datas.length;i++){
								values.push({
									name:datas[i].name,
									value:datas[i].value
								});
							}
						}
						chart_6923582f24d04b7e86ee71ddea2795df.setOption({
							// xAxis:{
							//     data:names
							// },
							// series: [{
							// 	data: servicedata
							// }]
						});

					},
					error : function(errorMsg) {
						//请求失败时执行该函数
						alert("图表请求数据失败!");
						chart_2218cf072f9d4fff8ba2467e502db8f0.hideLoading();
					}

				})
			})
		</script>
		<!--动态词云-->
		<script>
			var hhh = echarts.init(document.getElementById('77'))

			//跳转代码
			// myChart.on('click', function (params) {
			//       console.log(params.name);
			//       window.open(params.data.url);
			//       window.open('https://www.baidu.com/s?wd=' + encodeURIComponent(params.value));
			//   });

			var colorList = [
				[
					'#ff7f50',
					'#87cefa',
					'#da70d6',
					'#32cd32',
					'#6495ed',
					'#ff69b4',
					'#ba55d3',
					'#cd5c5c',
					'#ffa500',
					'#40e0d0',
					'#1e90ff',
					'#ff6347',
					'#7b68ee',
					'#d0648a',
					'#ffd700',
					'#6b8e23',
					'#4ea397',
					'#3cb371',
					'#b8860b',
					'#7bd9a5',
				],
				[
					'#ff7f50',
					'#87cefa',
					'#da70d6',
					'#32cd32',
					'#6495ed',
					'#ff69b4',
					'#ba55d3',
					'#cd5c5c',
					'#ffa500',
					'#40e0d0',
					'#1e90ff',
					'#ff6347',
					'#7b68ee',
					'#00fa9a',
					'#ffd700',
					'#6b8e23',
					'#ff00ff',
					'#3cb371',
					'#b8860b',
					'#30e0e0',
				],
				[
					'#929fff',
					'#9de0ff',
					'#ffa897',
					'#af87fe',
					'#7dc3fe',
					'#bb60b2',
					'#433e7c',
					'#f47a75',
					'#009db2',
					'#024b51',
					'#0780cf',
					'#765005',
					'#e75840',
					'#26ccd8',
					'#3685fe',
					'#9977ef',
					'#f5616f',
					'#f7b13f',
					'#f9e264',
					'#50c48f',
				],
			][2];

			var option = {
				// 图表标题
				// title: {
				//     show: true, //显示策略，默认值true,可选为：true（显示） | false（隐藏）
				//     //text: '"新时代"主题图谱', //主标题文本，'\n'指定换行
				//     x: 'center', // 水平安放位置，默认为左对齐，可选为：
				//     // 'center' ¦ 'left' ¦ 'right'
				//     // ¦ {number}（x坐标，单位px）
				//     y: 'top', // 垂直安放位置，默认为全图顶端，可选为：
				//     // 'top' ¦ 'bottom' ¦ 'center'
				//     // ¦ {number}（y坐标，单位px）
				//     //textAlign: null          // 水平对齐方式，默认根据x设置自动调整
				//     backgroundColor: 'rgba(0,0,0,0)',
				//     borderColor: '#ccc', // 标题边框颜色
				//     borderWidth: 0, // 标题边框线宽，单位px，默认为0（无边框）
				//     padding: 5, // 标题内边距，单位px，默认各方向内边距为5，
				//     // 接受数组分别设定上右下左边距，同css
				//     itemGap: 10, // 主副标题纵向间隔，单位px，默认为10，
				//     textStyle: {
				//         fontSize: 18,
				//         fontWeight: 'bolder',
				//         color: '#333', // 主标题文字颜色
				//     },
				//     subtextStyle: {
				//         color: '#aaa', // 副标题文字颜色
				//     },
				// },
				// title:{
				// 	text: '各省新增感染Top5(7月)',
				// 	padding: 5,
				// 	itemGap: 10,
				// 	textStyle: {
				// 		fontSize: 28
				// 	}
				// },
				backgroundColor: '#fff',
				tooltip: {},
				animationDurationUpdate: function (idx) {
					// 越往后的数据延迟越大
					return idx * 100;
				},
				animationEasingUpdate: 'bounceIn',
				color: ['#ff7f50', '#299', '#A41484'],
				series: [
					{
						draggable: true,
						// itemStyle: {
						// 	normal: {
						// 		shadowBlur: 100,
						// 		shadowColor: colorList[0],
						// 		color: colorList[0],
						// 	},
						// },
						type: 'graph',
						layout: 'force',
						force: {
							repulsion: 500,
							edgeLength: 10,
						},
						roam: true,
						label: {
							normal: {
								show: true,
							},
						},

						itemStyle: {
							normal: {
								// color:colorList[i]
								// color: function () {
								// 	return 'rgb(' + [
								// 		Math.round(Math.random() * 200),
								// 		Math.round(Math.random() * 200),
								// 		Math.round(Math.random() * 200)
								// 	].join(',') + ')';
								// }
							}

						},
						draggable: true,
						// symbolSize: function (value) {
						// 	return Math.sqrt() / 5e2;
						// },
						data: [

						// 	{
						// 		name: '医疗队女队员集体理平头和光头',
						// 		value: 2518,
						// 		symbolSize: 50,
						// 		draggable: true,
						// 		itemStyle: {
						// 			normal: {
						// 				shadowBlur: 100,
						// 				shadowColor: colorList[3],
						// 				color: colorList[3],
						// 			},
						// 		},
						// 	},

						],
					},
				],
			};

			hhh.setOption(option)
			$(document).ready(function() {
				var values = [];
				$.ajax({
					url : "http://localhost:8080/welfare",//后台请求的数据，用的是PHP
					dataType : "json",//数据格式
					type : "GET",//请求方式
					async : false,//是否异步请求
					success : function(datas) {  //如果请求成功，返回数据。
						var names = [];
						var mydata = [];
						console.log(datas);
						var len = eval(datas);
						var data = []
						var servicedata=[];
						var colorList =
							[
								'#ff7f50',
								'#87cefa',
								'#da70d6',
								'#32cd32',
								'#6495ed',
								'#ff69b4',
								'#ba55d3',
								'#cd5c5c',
								'#ffa500',
								'#40e0d0',
								'#1e90ff',
								'#ff6347',
								'#7b68ee',
								'#d0648a',
								'#ffd700',
								'#6b8e23',
								'#4ea397',
								'#3cb371',
								'#b8860b',
								'#7bd9a5',
							]
						if(datas){
							for(var i=0;i<datas.length;i++){
								values.push({
									name:datas[i].welfare,
									value:datas[i].count,
									symbolSize: (datas[i].count/30),
											itemStyle: {
												normal: {
													shadowBlur: 100,
													shadowColor: colorList[i],
													color: colorList[i],
												},
											},

								});
							}
						}
						hhh.setOption({
							series:[{
								data:values
							}]
						});

					},
					error : function(errorMsg) {
						//请求失败时执行该函数
						alert("图表请求数据失败!");
						myChart.hideLoading();
					}

				})
			})
		</script>



<!--		<script type="text/javascript" th:src="@{/js/jquery-3.2.1.slim.min.js}" ></script>-->



	</body>

</html>